import React from 'react'
import { Outlet, NavLink } from "react-router-dom"
import { Tabbar } from 'react-vant'
import { ServiceO, HomeO, BookmarkO, Contact } from '@react-vant/icons'
type Props = {}

const Index = (props: Props) => {
    return (
        <div className='index'>
            <main><Outlet></Outlet></main>
            <footer>
                <div className='demo-tabbar'>
                    <Tabbar>
                        <Tabbar.Item icon={<HomeO />}><NavLink to="/home/home">首页</NavLink></Tabbar.Item>
                        <Tabbar.Item icon={<BookmarkO  />}><NavLink to="/home/orderForGoods">订单</NavLink></Tabbar.Item>
                        <Tabbar.Item icon={<ServiceO  />}><NavLink to="/home/customer">客服</NavLink></Tabbar.Item>
                        <Tabbar.Item icon={<Contact  />}><NavLink to="/home/my">我的</NavLink></Tabbar.Item>
                    </Tabbar>
                </div>
            </footer>
        </div>
    )
}

export default Index